<template>
  <div class="home">
      <div class="bg"><img src="../../assets/img/home1.png" alt="" srcset=""></div>
      <div class="logo"><img src="../../assets/img/logo.png" alt="" srcset=""></div>
      <div class="name">ZLToken-ZLT<br />热钱包</div>
      <router-link to="/login"><button class="login">登录</button></router-link><br />
      <router-link to="/register"><button class="register">注册</button></router-link>
  </div>
</template>
<script>
export default {
  
}
</script>
<style lang="scss">
.home{
    // position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    .bg{
        z-index: -1;
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        width: 100%;
        height: 100%;
        img{
            width: 100%;
            height: 100%;
        }
    }
    .logo{
        // display: flex;
        // justify-content: center;
        display: inline-block;
        width: 48%;
        height:48%;
        transform: translateY(245px);
        img{
            width: 100%;
            height:100%;
        }
    }
    .name{
        transform: translateY(290px);        
        font-size: 55.73px;
        color: #fff;
        font-weight: 600;
    }
    button{
        width: 560px;
        height: 106px;
        background: none;
        outline: none;
        border: none;
        border: 3px solid #00b7ff;
        border-radius: 8px;
        font-size: 32px;
        color: #fff;
    }
    .login{
        transform: translateY(420px);                
    }
    .register{
        transform: translateY(459px);                        
    }
}
</style>
